<template>
  <view>scroll-view纵向滚动</view>
  <scroll-view class="scroll-y" scroll-y="true">
    <view class="bg-blue item">A</view>
    <view class="bg-green item">B</view>
    <view class="bg-red item">C</view>
  </scroll-view>
  <view>scroll-view横向滚动</view>
  <scroll-view class="scroll-x" scroll-x="true">
    <view class="bg-blue item">aaaaa</view>
    <view class="bg-green item">B</view>
    <view class="bg-red item">C</view>
  </scroll-view>
</template>

<script>
	export default {
		data(){
			return{
				
			}
		}
	}
</script>

<style>	.item {		height: 200upx;	}	.item2 {		height: 200upx;		display: inline-block;/*子内容显示在一行*/		width: 100%;	}	.bg-blue {		background-color: #007AFF;	}	.bg-green {		background-color: #4CD964;	}	.bg-red {		background-color: #AA0000;	}	.scroll-y {		height: 200upx;	}	.scroll-x {			white-space: nowrap; /*该滚动区域的子内容显示在一行*/	}</style>